import biaoge from "../../../Zhpg/Yxfx/YxfxXq/biaoge";
import { Descriptions,Button } from "antd";
import DarkCard from "../../../../../../common/DarkCard";
import { CloseOutlined } from "@ant-design/icons";
import { useEffect,useState } from "react";
import CztApi from "../../../../../../../utils/apis/CztApi";
import JzzyApi from "../../../../../../../utils/apis/JzzyApi";
import Api from "../../../../../../../utils/api";

export default function DzenXqDetail(props){
    const btzd=biaoge();
    const [data2,setData2]=useState()
    let {xlName,datas1}=props;
    const data=JSON.parse(xlName?.xq)
    console.log('data2',data2)
    //暂时
    useEffect(()=>{
        // console.log('xlName',xlName)
        CztApi.listId(xlName.id).then(resp=>{
            console.log('czt',resp)
            if(resp.rows){
                console.log('czt2',resp)

            }
        })
        JzzyApi.listId(xlName.id).then(resp=>{
            console.log('jzzy',resp)
            if(resp.data){
                console.log('jzzy2',resp)
            }
        })
        // return()=>{
        //     datas1=null;xlName=null;
        // }
    },[xlName,datas1])
    useEffect(()=>{
        
        Api.getConfig().then(resp=>{
            if(datas1){
                setData2(resp?.detailTemplate?.[`${datas1}`])
            }
            
            //console.log('data',resp?.detailTemplate?.[`${cztxl}`])
        })
    },[datas1])
    return <>
         {datas1&& <DarkCard style={{
            position:'absolute',
            right:'10px',
            width: '300px',
            top: '20px',
            bottom: '20px',
            pointerEvents: 'auto',
            borderRadius: 8,
        }} className="layout-v">
            <div style={{
                fontSize: 20,
                fontWeight: "bold",
                borderBottom: "1px solid #eee",
                paddingBottom: 12,
                marginBottom: 12
            }} className='layout-h center'>
                 <div className='fill w0'>{xlName?.title}</div>
                 <div>
                    <Button size="small" icon={<CloseOutlined />} style={{
                        // color: "#fff"
                    }} onClick={e => {
                        props?.onClose?.()
                    }} />
                </div>

        </div>
           <Descriptions column={1} bordered size="large" className="fill h0" style={{
                overflow:'auto'
            }}>
                
               
                
                {
                    
                    data2?.map((e)=>{
                        if(datas1==="有名饭店"){
                            datas1="星级酒店";
                        }
                        
                        return (
                            <Descriptions.Item label={e.alias}>{data?.[e.name]}</Descriptions.Item>
                        )
                    })
                } 
              
            </Descriptions>
        </DarkCard>}
    </>
}